<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>Simple example - Editor.md examples</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="vendor/fontawesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="vendor/editormd/css/editormd.css">
    <link rel="stylesheet" href="vendor/bootoast/bootoast.css">
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon">
</head>

<body>
    <div class="content" id="vue-app">
        <div class="left">
            <div class="index">
                <div class="header">
                    <span class="fa fa-book fa-lg dir" v-on:click="returnDir">{{workDir.name}}</span>
                    <a href="javascript:void(0)" class="glyphicon glyphicon-plus" v-on:click="showAddDialog"></a>
                </div>
                <ul class="items">
                    <li v-for="(item, pos) in workDir.files" :key="pos">
                        <input class="ra" type="radio" name="item" :id="'item' + pos">
                        <label class="fa fa-file fa-lg item" :for="'item' + pos" v-on:click="loadNote">{{item}}</label>
                        <a class="glyphicon glyphicon-trash" href="javascript:void(0)" v-on:click="throwTrash(pos)"></a>
                    </li>
                </ul>
            </div>
        </div>

        <div id="editormd">
        </div>

        <div class="model">
            <div class="dialog form form-horizontal">
                <div class="form-group">
                    <div class="col-sm-12">
                        <button type="button" class="close" aria-label="Close" v-on:click="closeAddDialog">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-12">
                        <input id="text" type="text" class="form-control" placeholder="Text...">
                    </div>
                </div>
                <div class="form-group">
                    <div class="radio col-sm-12">
                        <label>
                            <input id="r1" name="r1" type="radio" checked>Categary</label>
                        <label>
                            <input name="r1" type="radio">Note</label>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-8 col-sm-4">
                        <input type="button" class="btn btn-default" value="Add" v-on:click="addNoteCate">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="vendor/jquery/jquery.min.js"></script>
    <script src="vendor/bootoast/bootoast.js"></script>
    <script src="vendor/editormd/js/editormd.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="js/comm.js"></script>
    <script src="js/index.js"></script>
</body>

</html>